/**
 *
 * @User:   winter
 * @Date:   2019-08-27
 * @Time:   14:53
 *
 **/
#app {
  .container {
    padding-bottom: .24rem;

    .header {
      width: 100%;
      height: .44rem;
      padding: .09rem .15rem;

      .header-logo {
        width: 1.04rem;
        height: .26rem;
        background-image: url("../img/logo@2x.png");
        background-size: 100% 100%;
        background-repeat: no-repeat;
      }
    }

    .banner {
      width: 3.75rem;
      height: 1.60rem;
      background-color: white;

      .swiper-container {
        .swiper-wrapper {
          .swiper-slide-1 {
            width: 3.75rem;
            height: 1.6rem;
            background-image: url("../img/cloud/banner-1@2x.png");
            background-size: 100% 100%;
            background-repeat: no-repeat;
            padding-left: .25rem;
            padding-top: .25rem;

            .scheme {
              height: .28rem;
              font-size: .2rem;
              font-weight: 500;
              color: white;
              line-height: .28rem;
            }

            .describe {
              width: 1.59rem;
              height: .36rem;
              font-size: .07rem;
              font-family: SourceHanSansCN-Regular;
              transform: scale(0.8);
              -webkit-transform: scale(0.8); /*兼容-webkit-引擎浏览器*/
              -moz-transform: scale(0.8);
              font-weight: 400;
              color: white;
              line-height: .12rem;
            }

            .line {
              width: .59rem;
              height: .01rem;
              border: 1px solid white;
            }

            .download {
              display: block;
              margin-top: .2rem;
              width: .80rem;
              height: .28rem;
              border-radius: .04rem;
              border: 1px solid white;
              padding: .04rem .07rem;

              span {
                line-height: .1rem;
                display: block;
                font-size: .07rem;
                text-align: center;
                color: white;
              }
            }
          }
        }
      }
    }

    .official_notice {
      width: 100%;
      height: 1.74rem;
      background-color: rgba(51, 51, 51, .69);
      background-image: url("../img/cloud/banner_2@3x.png");
      background-repeat: no-repeat;
      background-size: 100% 100%;

      .text {
        font-size: .12rem;
        font-weight: 400;
        color: white;
        line-height: .20rem;
      }

      .download {
        height: .22rem;
        width: 100%;
        padding-top: .1rem;
        text-align: center;

        button {
          text-align: center;
          padding: .04rem .09rem;
          vertical-align: top;
          width: .8rem;
          height: .22rem;
          background: var(--color-warning);
          border-radius: .04rem;
          border: 0;
          outline: none;
          color: var(--color-text-one-title);
          line-height: .14rem;
          font-size: .12rem;
        }
      ;
      }
    }

    .tab_main, .testimonial_box, .programme_box, .applications_box, .partner_box, .scene_box, .realize_box {
      padding: .3rem .15rem;
    }

    .testimonial_box, .programme_box, .cases_box, .applications_box, .partner_box, .scene_box, .realize_box {
      .testimonial, .programme, .cases, .applications, .partner, .scene, .realize {
        position: relative;
        left: 50%;
        transform: translateX(-50%);

        &_top, &_bottom {
          color: var(--color-text-one-title);
        }

        &_top {
          height: .22rem;
          font-weight: 500;
          line-height: .22rem;
          font-size: .16rem;
          text-align: center;
        }

        &_bottom {
          position: absolute;
          height: .07rem;
          bottom: .03rem;
          background-color: var(--color-warning);
          z-index: -1;
        }
      }

      .scene {
        width: 0.66rem;

        &_top, &_bottom {
          width: 0.66rem;
        }
      }

      .realize {
        width: 0.66rem;

        &_top, &_bottom {
          width: 0.66rem;
        }
      }

      .testimonial {
        width: 0.66rem;

        &_top, &_bottom {
          width: 0.66rem;
        }
      }

      .programme {
        width: .73rem;

        &_top, &_bottom {
          width: .73rem;
        }
      }

      .cases {
        width: .34rem;

        &_top, &_bottom {
          width: .34rem;
        }
      }

      .applications {
        width: 1.21rem;

        &_top, &_bottom {
          width: 1.21rem;
        }
      }

      .partner {
        width: .74rem;

        &_top, &_bottom {
          width: .74rem;
        }
      }
    }

    .tab_main {
      .application-tab {
        .nav-tabs {
          display: flex;
          display: -webkit-flex;
          justify-content: center;
          align-items: center;

          li {
            flex: 1;
            text-align: center;
            font-size: .14rem;
            font-weight: 500;
            color: var(--color-text-one-title);
            line-height: .2rem;
          }

          .ic {
            img {
              display: inline-block;
              vertical-align: top;
              width: .31rem;
              height: .31rem;
            }

            p {
              margin-top: .08rem;
            }
          }

          .chip {
            padding-top: .05rem;

            img {
              display: inline-block;
              vertical-align: top;
              width: .38rem;
              height: .2rem;
            }

            p {
              margin-top: .14rem;
            }
          }
        }

        .tab-content {
          margin-top: .2rem;

          .tab-pane {
            display: none;
          }

          .active {
            display: block !important;
          }
        }
      }
    }

    .marshalling {
      width: 100%;
      height: 1.47rem;

      img {
        width: 100%;
        height: 100%;
      }
    }

    .division {
      width: 100%;
      height: .1rem;
      background: rgba(245, 245, 245, 1);
    }

    .scene_box {
      .scene {
        &_msg {
          display: flex;
          display: -webkit-flex;
          justify-content: center;
          align-items: center;
          margin-top: .16rem;

          &_item {
            flex: 1;
            position: relative;
            height: 1.44rem;
            box-shadow: 0 .02rem .05rem 0 rgba(193, 193, 193, 0.5);

            img {
              display: inline-block;
              width: 100%;
              height: 100%;
              position: absolute;
              top: 0;
              left: 0;
            }

            .title {
              position: absolute;
              left: .06rem;
              top: .19rem;
              height: .20rem;
              font-size: .14rem;
              font-weight: 500;
              line-height: .20rem;

              &-1 {
                color: rgba(5, 137, 243, 1);
              }

              &-2 {
                color: rgba(40, 180, 132, 1);
              }

              &-3 {
                color: rgba(240, 130, 0, 1);
              }
            }

            .info {
              font-size: .12rem;
              font-weight: 400;
              color: rgba(119, 119, 119, 1);
              line-height: .16rem;
              position: absolute;
              left: .06rem;
              top: .5rem;
            }
          }

          &_item:nth-child(2) {
            margin-left: .08rem;
            margin-right: .08rem;
          }
        }
      }
    }

    .realize_box {
      .realize {
        &_msg {
          height: 2.56rem;
          overflow: hidden;
          background-image: url("../img/cloud/bg-4@3x.png");
          background-size: 100% 100%;
          background-repeat: no-repeat;
          margin-top: .2rem;

          &_item {
            width: 2.85rem;
            height: .42rem;
            background: rgba(250, 193, 35, 1);
            border-radius: .04rem;
            margin-bottom: .08rem;
            text-align: center;
            line-height: .42rem;
            font-size: .12rem;
            font-weight: 500;
            color: var(--color-text-one-title);
          }

          &_item:nth-child(1) {
            margin-top: .57rem;
          }
        }
      }
    }

    .testimonial_box {
      .testimonial_swiper {
        .swiper-container {
          overflow: initial;

          .testimonial_swiper_in_container {
            width: calc(100% - .68rem);
            margin: 0 auto;
            overflow: hidden;

            .swiper-wrapper {
              .swiper-slide {
                &-box {
                  padding-top: .4rem;
                  padding-bottom: .02rem;
                }

                &-msg {
                  position: relative;
                  width: 2.7rem;
                  height: 2.68rem;
                  margin-left: .04rem;
                  box-shadow: 0 .02rem .06rem 0 rgba(241, 188, 39, 0.65);
                  border-radius: .08rem;

                  &-img {
                    width: .50rem;
                    height: .50rem;
                    border-radius: 50%;
                    position: absolute;
                    top: -0.25rem;
                    left: calc(50% - .25rem);

                    img {
                      display: block;
                    }
                  }
                }

                &-msg:before {
                  content: '';
                  height: 1px;
                  display: block;
                }

                &-title {
                  text-align: center;
                  margin-top: calc(.39rem - 1px);
                  height: .2rem;
                  font-size: .14rem;
                  font-weight: 500;
                  color: var(--color-text-one-title);
                  line-height: .2rem;
                }

                &-info {
                  //width:251px;
                  //height:131px;
                  padding: .10rem .13rem;
                  font-size: .12rem;
                  font-weight: 400;
                  color: var(--color-text-one-title);
                  line-height: .18rem;
                  text-align: center;

                  o {
                    width: .23rem;
                    height: .18rem;
                    margin-top: -.05rem;
                    background-image: url("../img/semiconductor/ic-douhao@2x.png");
                    background-repeat: no-repeat;
                    background-size: 100% 100%;
                    display: inline-block;
                    zoom: 1;
                    letter-spacing: normal;
                    word-spacing: normal;
                    vertical-align: top;
                    text-rendering: auto;
                  }
                }
              }
            }

            .swiper-button-next {
              width: .2rem;
              height: .2rem;
              //border: 2px solid rgba(8, 94, 236, 1);
              border-radius: 50%;
              background-image: url("../img/semiconductor/ic-right@2x.png");
              background-size: 100% 100%;
              margin-top: 0;
              outline: none;
            }

            .swiper-button-prev {
              width: .2rem;
              height: .2rem;
              //border: 2px solid rgba(8, 94, 236, 1);
              border-radius: 50%;
              background-image: url("../img/semiconductor/ic-left@2x.png");
              background-size: 100% 100%;
              margin-top: 0;
              outline: none;
            }

            .swiper-pagination {
              bottom: -.3rem;

              .swiper-pagination-bullet {
                width: .08rem;
                height: .08rem;
                background: none;
                border: .01rem solid var(--color-text-one-title);
              }

              .swiper-pagination-bullet-active {
                background: var(--color-text-one-title);
              }
            }
          }
        }
      }
    }

    .programme_box {
      .programme {
        margin-bottom: .2rem;

        &_msg {
          width: 3.45rem;
          background: white;
          box-shadow: 0 .02rem .05rem 0 rgba(193, 193, 193, 0.5);
          -webkit-box-shadow: 0 .02rem .05rem 0 rgba(193, 193, 193, 0.5);
          -moz-box-shadow: 0 .02rem .05rem 0 rgba(193, 193, 193, 0.5);
          border-radius: .06rem;
          padding: .11rem .12rem;
          margin-bottom: .12rem;
        }

        &_msg:last-of-type {
          margin-bottom: 0;
        }

        &_title {
          height: .26rem;
          display: flex;
          display: -webkit-flex;
          flex-direction: row;
          //justify-content: ;
          align-items: center;

          .left_ico {
            width: .34rem;
            height: .26rem;
            float: left;

            img {
              width: 100%;
              height: 100%;
              display: block;
            }
          }

          .info {
            font-size: .14rem;
            margin-left: .17rem;
            font-weight: 500;
            color: var(--color-text-one-title);
            flex: auto;
          }

          .right_ico {
            width: .19rem;
            height: .11rem;
            background-image: url("../img/life/programme_5@3x.png");
            background-size: 100% 100%;
            background-repeat: no-repeat;
          }
        }

        &_info {
          display: none;
          margin-left: .51rem;
          border-top: .01rem solid var(--color-border-one);
          padding-top: .13rem;
          margin-top: .14rem;
          font-size: .12rem;
          font-weight: 400;
          color: var(--color-text-base);
          line-height: .17rem;
        }
      }

      .active {
        .programme {
          &_title {
            .right_ico {
              background-image: url("../img/life/programme_6@3x.png");
            }
          }
        }

        .programme_info {
          display: block;
        }
      }
    }

    .cases_box {
      padding: 0.3rem 0;

      .cases {
        &_tab {
          display: flex;
          display: -webkit-flex;
          justify-content: center;
          align-items: center;
          border-bottom: 1px solid var(--color-border-one);

          &_item {
            padding-top: .2rem;
            padding-bottom: .12rem;
            position: relative;
            flex: 1;
            font-size: .12rem;
            font-weight: 500;
            color: var(--color-text-one-title);
            line-height: .17rem;
            text-align: center;
          }

          .active.cases_tab_item:before {
            width: 100%;
            height: .02rem;
            content: '';
            position: absolute;
            left: 0;
            bottom: -1px;
            z-index: 1;
            display: block;
            background-color: var(--color-warning);
          }
        }

        &_msg {
          &_box {
            padding: 0 .15rem;
            display: none;
          }

          &_box.active {
            display: block;
          }

          &_item {
            width: 100%;
            background: white;
            margin-top: .2rem;
            box-shadow: 0 .01rem .03rem 0 rgba(0, 0, 0, 0.1);
            border-radius: .02rem;
            border: .01rem solid rgba(229, 229, 229, 1);

            &_title {
              width: 100%;
              height: .36rem;
              font-size: .15rem;
              font-weight: 400;
              color: var(--color-text-three-title);
              padding-left: .11rem;
              line-height: .36rem;
              border-bottom: 1px solid var(--color-border-one);
            }

            &_info {
              padding: .1rem;
              display: -webkit-flex;
              display: flex;
              align-items: center;

              .left {
                width: 2rem;

                .text {
                  font-size: .12rem;
                  font-weight: 400;
                  color: var(--color-text-base);
                  line-height: .2rem;
                }

                .button {
                  text-align: left;
                  height: .31rem;
                  padding-top: .1rem;

                  button {
                    width: .66rem;
                    height: .21rem;
                    font-size: .12rem;
                    color: var(--color-text-one-title);
                    border: .01rem solid var(--color-warning);
                    vertical-align: top;
                    background-color: transparent;
                    outline: none;
                  }

                }

              }

              .right {
                padding-left: .1rem;
                flex-grow: 1;
                max-width: 1.14rem;
                height: 1.48rem;
              }
            }
          }
        }
      }
    }

    .applications_box {
      padding-right: 0;
      padding-bottom: .5rem;

      .applications_swiper {
        padding-top: .2rem;

        .more {
          .applications_swiper_item {
            .img {
              text-align: center;
              position: relative;

              img {
                width: .38rem;
                height: .38rem;
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%, -50%);
                display: inline-block;
                vertical-align: top;
              }
            }

            .info {
              text-align: center;
            }
          }
        }

        .applications_swiper_item {
          width: 1rem;
          height: 1.09rem;
          border-radius: .04rem;
          border: .01rem solid rgba(229, 229, 229, 1);
          overflow: hidden;

          .img {
            width: 1rem;
            height: .83rem;

            img {
              display: block;
              width: 100%;
              height: 100%;
            }
          }

          .info {
            height: .17rem;
            font-size: .12rem;
            font-weight: 500;
            color: var(--color-text-one-title);
            line-height: .17rem;
            padding-left: .08rem;
            padding-top: .04rem;
          }
        }
      }
    }

    .information_box {
      width: 3.75rem;
      height: 1.46rem;
      background-image: url("../img/life/banner-0@3x.png");
      background-size: 100% 100%;
      background-repeat: no-repeat;

      .title {
        padding-top: .3rem;
        width: 100%;
        font-size: .16rem;
        font-weight: 500;
        color: white;
        line-height: .22rem;
        text-align: center;
      }

      .button {
        width: 100%;
        height: .32rem;
        text-align: center;
        margin-top: .24rem;

        span {
          width: .84rem;
          padding: .07rem .17rem;
          display: inline-block;
          vertical-align: top;
          background: var(--color-warning);
          border-radius: .43rem;
          font-size: .12rem;
          font-weight: 400;
          color: var(--color-text-one-title);
          line-height: .18rem;
        }
      }
    }

    .partner_box {
      padding-right: 0;
      padding-left: 0;
      .partner {
        &_msg {
          display: flex;
          display: -webkit-flex;
          flex-wrap: wrap;
          justify-content: center;
          align-items: center;
        }

        &-1, &-2, &-3, &-4, &-5, &-6, &-7, &-8 {
          background-size: 100% 100%;
          background-repeat: no-repeat;
          margin-top: .2rem;
        }

        &-1 {
          width: .33rem;
          height: .19rem;
          background-image: url("../img/life/partner-1@3x.png");
          margin-right: .23rem;
        }

        &-2 {
          width: .66rem;
          height: .19rem;
          background-image: url("../img/life/partner-2@3x.png");
          margin-right: .24rem;
        }


        &-3 {
          width: .99rem;
          height: .16rem;
          background-image: url("../img/life/partner-3@3x.png");
          margin-right: .23rem;
        }


        &-4 {
          width: .76rem;
          height: .17rem;
          background-image: url("../img/life/partner-4@3x.png");
        }

        &-5 {
          width: .62rem;
          height: .17rem;
          background-image: url("../img/life/partner-5@3x.png");
          margin-right: .26rem;
        }

        &-6 {
          width: .66rem;
          height: .15rem;
          background-image: url("../img/life/partner-6@3x.png");
          margin-right: .26rem;
        }

        &-7 {
          width: .79rem;
          height: .14rem;
          background-image: url("../img/life/partner-7@3x.png");
          margin-right: .26rem;
        }

        &-8 {
          width: .76rem;
          height: .16rem;
          background-image: url("../img/life/partner-8@3x.png");
        }
      }

    }

    .copyright_box {
      height: .14rem;
      font-size: .1rem;
      font-weight: 500;
      color: rgba(80, 80, 80, 1);
      line-height: .14rem;
      text-align: center;
      a {
        color: rgba(80, 80, 80, 1);
      }
    }
  }

  .popup_box {
    .modals {
      position: fixed;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      display: none;
      z-index: 1000;
      overflow: auto;
      background-color: rgba(0, 0, 0, .59);

      .modal {
        width: 100vw;
        height: 100vh;
        position: relative;

        &-dialog {
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%);

          &-top {
            .close_box {
              .close {

              }
            }
          }
        }
      }
    }
  }

  #white_book {
    .modal {
      &-dialog {
        &-flip {
          position: relative;
          transform-style: preserve-3d;

          .front, .back {
            backface-visibility: hidden;
            transform-style: preserve-3d;
            z-index: 1;
            height: 100%;
            width: 100%;
            transition: all 0.5s ease-out 0s;
          }

          .front {
            position: absolute;
            z-index: 1;
            transform: rotateY(0deg);
          }

          .back {
            position: relative;
            z-index: 0;
            transform: rotateY(180deg);
          }
        }
      }

      &-top {
        width: 100%;
        background-image: url("../img/icsolutions/bg-sim@3x.png");
        background-repeat: no-repeat;
        background-size: 100% 100%;
        line-height: 0;

        .close {
          &_box {
            padding: .1rem .12rem;
            overflow: hidden;

            .close {
              width: .2rem;
              height: .2rem;
              background-image: url("../img/life/ic-close@3x.png");
              background-repeat: no-repeat;
              background-size: 100% 100%;
              float: right;
            }
          }
        }

        .title {
          text-align: center;
          font-size: .18rem;
          font-weight: 500;
          color: white;
          line-height: .47rem;
        }
      }

      &-middle {
        width: 100%;
        min-height: 2.35rem;
        background-color: white;


        .ico {
          text-align: center;
          padding-top: .18rem;
          font-size: .12rem;
          font-family: PingFangSC-Regular, PingFang SC;
          font-weight: 400;
          color: rgba(51, 51, 51, 1);
          line-height: .17rem;
        }

        .qr {
          text-align: center;
          line-height: 0;

          img {
            width: 1.2rem;
            height: 1.2rem;
          }
        }

        .remark {
          padding: 0 .15rem;
          text-align: center;
          font-size: .14rem;
          font-family: PingFangSC-Medium, PingFang SC;
          font-weight: 500;
          color: rgba(51, 51, 51, 1);
          line-height: .2rem;
        }

        .describe {
          text-align: center;
          font-size: .12rem;
          font-family: PingFangSC-Regular, PingFang SC;
          font-weight: 400;
          color: rgba(119, 119, 119, 1);
          line-height: .26rem;
        }

        .button-flip {
          text-align: right;
          padding: .1rem;
          line-height: 0;

          span {
            font-size: .12rem;
            font-family: PingFangSC-Regular, PingFang SC;
            font-weight: 400;
            color: rgba(86, 152, 255, 1);
            line-height: .14rem;
            vertical-align: top;
            border-bottom: .01rem solid rgba(86, 152, 255, 1);
          }
        }

        .input {
          text-align: center;
          padding-left: .26rem;
          padding-right: .26rem;
          padding-top: .26rem;

          input {
            width: 2.55rem;
            height: .34rem;
            font-size: .12rem;
            padding-left: .44rem;
            background: rgba(255, 255, 255, 1);
            box-shadow: 0 .02rem .07rem 0 rgba(106, 106, 106, 0.5);
            -webkit-box-shadow: 0 .02rem .07rem 0 rgba(106, 106, 106, 0.5);
            -moz-box-shadow: 0 .02rem .07rem 0 rgba(106, 106, 106, 0.5);
            border: .01rem solid var(--color-text-one-title);
            vertical-align: top;
          }

          .input_name, .input_eml {
            position: relative;
            line-height: 0;
          }

          .input_name {
            i {
              position: absolute;
              top: .08rem;
              left: .13rem;
              display: block;
              width: .20rem;
              height: .20rem;
              background-image: url("../img/icsolutions/ic-name@3x.png");
              background-repeat: no-repeat;
              background-size: 100% 100%;
            }
          }

          .input_eml {
            i {
              position: absolute;
              top: .06rem;
              left: .13rem;
              display: block;
              width: .15rem;
              height: .23rem;
              background-image: url("../img/icsolutions/ic-eml@3x.png");
              background-repeat: no-repeat;
              background-size: 100% 100%;
            }
          }

          input::-webkit-input-placeholder { /* WebKit, Blink, Edge */
            font-size: .12rem;
            line-height: .34rem;
          }

          input::-moz-placeholder { /* Mozilla Firefox 19+ */
            font-size: .12rem;
            line-height: .34rem;
          }

          input::-ms-input-placeholder { /* Internet Explorer 10-11 */
            font-size: .12rem;
            line-height: .34rem;
          }

          input::placeholder { /* Mozilla Firefox 4 to 18 */
            font-size: .12rem;
            line-height: .34rem;
          }
        }

        .button {
          line-height: 0;
          text-align: center;
          padding-top: .24rem;

          button {
            width: .69rem;
            height: .27rem;
            background: rgba(3, 168, 248, 1);
            box-shadow: 0 0 .03rem 0 rgba(1, 123, 181, 1);
            vertical-align: top;
            font-size: .16rem;
            font-weight: 500;
            color: white;
            border: 0;
            outline: none;
          }
        }

        .transmission {
          font-size: .12rem;
          font-family: PingFangSC-Regular, PingFang SC;
          font-weight: 400;
          color: rgba(119, 119, 119, 1);
          line-height: .26rem;
        }
      }
    }
  }

  #app_modals {
    .modal {
      &-dialog {
        width: 3.21rem;
        padding-top: .15rem;
        padding-bottom: .15rem;
        background-color: white;
        border-radius: .06rem;
      }

      &-top {
        width: 3.45rem;
        height: 1.67rem;
        margin-left: -.12rem;
        background: linear-gradient(135deg, rgba(86, 120, 242, 1) 0%, rgba(28, 52, 214, 1) 100%);

        .close {
          &_box {
            padding: .08rem .18rem;
            overflow: hidden;

            .close {
              width: .15rem;
              height: .15rem;
              background-image: url("../img/life/ic-close@3x.png");
              background-repeat: no-repeat;
              background-size: 100% 100%;
              float: right;
            }
          }
        }

        .title {
          font-size: .26rem;
          font-weight: 500;
          color: white;
          padding-left: .37rem;
          line-height: .30rem;
        }

        .msg {
          font-size: .08rem;
          font-weight: 400;
          color: white;
          line-height: .12rem;
          padding-left: .37rem;
          padding-top: .1rem;
        }
      }

      &-middle {
        padding: .2rem .25rem;

        .title {
          height: .31rem;
          font-size: .14rem;
          font-weight: 400;

          line-height: .16rem;
          padding-bottom: .12rem;

          em {
            color: var(--2B43E1);
          }

          span {
            color: var(--color-text-one-title);
          }
        }


        .input {
          &_name, &_phone {
            //text-align: center;
            height: .56rem;
            padding-bottom: .2rem;
            position: relative;

            .ic_name {
              position: absolute;
              top: .06rem;
              left: .09rem;
              width: .2rem;
              height: .2rem;
              background-image: url("../img/life/from-ic-name@3x.png");
              background-repeat: no-repeat;
              background-size: 100% 100%;
            }

            .ic_phone {
              position: absolute;
              top: .07rem;
              left: .11rem;
              width: .16rem;
              height: .22rem;
              background-image: url("../img/life/from-ic-phone@3x.png");
              background-repeat: no-repeat;
              background-size: 100% 100%;
            }

            input {
              width: 2.7rem;
              height: .34rem;
              font-size: .14rem;
              background: rgba(255, 255, 255, 1);
              vertical-align: top;
              border: .01rem solid #aaa;
              outline: none;
              box-shadow: 0 .01rem .04rem 0 rgba(106, 106, 106, 0.5);
              -webkit-box-shadow: 0 .01rem .04rem 0 rgba(106, 106, 106, 0.5);
              -moz-box-shadow: 0 .01rem .04rem 0 rgba(106, 106, 106, 0.5);
              padding-left: .41rem;
              line-height: .2rem;
            }

            input::-webkit-input-placeholder {
              color: rgba(160, 160, 160, 1);
            }

            ::-webkit-input-placeholder { /* WebKit, Blink, Edge */
              color: rgba(160, 160, 160, 1);
            }

            :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
              color: rgba(160, 160, 160, 1);
            }

            ::-moz-placeholder { /* Mozilla Firefox 19+ */
              color: rgba(160, 160, 160, 1);
            }

            :-ms-input-placeholder { /* Internet Explorer 10-11 */
              color: rgba(160, 160, 160, 1);
            }

            input:focus {
              border: .01rem solid rgba(43, 67, 225, 1);
            }
          }
        }

        .button {
          padding-top: .09rem;
          height: .41rem;
          text-align: center;

          button {
            width: .82rem;
            height: .32rem;
            color: white;
            font-size: .20rem;
            font-weight: 500;
            line-height: .28rem;
            background-color: var(--2B43E1);
            vertical-align: top;
            border: 0;
            outline: none;
          }
        }
      }
    }
  }

  #submit_modals {
    .modal {
      &-dialog {
        width: 2.78rem;
        padding-top: .37rem;
        padding-bottom: .22rem;
        background-color: white;
        border-radius: .06rem;
      }

      &-top {
        text-align: center;
        height: .76rem;
        padding-bottom: .22rem;

        img {
          width: .54rem;
          height: .54rem;
          vertical-align: top;
        }
      }

      &-middle {
        padding-left: .21rem;
        padding-right: .22rem;

        .title {
          height: .3rem;
          font-size: .16rem;
          font-weight: 500;
          color: rgba(51, 51, 51, 1);
          line-height: .22rem;
          text-align: center;
          padding-bottom: .08rem;
        }

        .msg {
          text-align: center;
          height: .64rem;
          font-size: .12rem;
          font-weight: 400;
          color: rgba(119, 119, 119, 1);
          line-height: .17rem;
          padding-bottom: .3rem;
        }

        .button {
          height: .3rem;
          text-align: center;

          button {
            vertical-align: top;
            width: .72rem;
            height: .30rem;
            background: rgba(85, 119, 241, 1);
            border-radius: .26rem;
            font-size: .16rem;
            font-weight: 500;
            color: white;
            line-height: .22rem;
            outline: none;
          }
        }
      }

    }
  }
}
